<template>
	<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper" @scrolltolower="lower" @scroll="scroll" style="height: 1200rpx;width: 750rpx;" :lower-threshold="lower_threshold" refresher-enabled="true" :refresher-triggered="triggered" @refresherrefresh="onRefresh" :refresher-threshold="100" @refresherpulling="pulling" refresher-background="#FF7300">
		<view style="width: 750rpx;height: 600rpx;position: relative;" v-if="xianshi == 2">
			<view style="width: 200rpx;height: 50rpx;border: 1rpx solid #808080;border-radius: 9rpx;line-height: 50rpx;text-align: center;position: absolute;z-index: 1212;top: 260rpx;left: 275rpx;color: #FF7300;font-size: 25rpx;letter-spacing: 3rpx;" v-if="list_shuju == 0" @tap="gomaike">前往购买</view>
			<view style="width: 200rpx;height: 50rpx;border-radius: 9rpx;line-height: 50rpx;text-align: center;position: absolute;z-index: 1212;top: 320rpx;left: 275rpx;font-weight: bold;color:#808080;letter-spacing: 4rpx;font-size: 45rpx;">暂无数据</view>
		</view>
		<view style="padding: 20rpx 45.3rpx 0 192rpx;margin-bottom: 170rpx;width: 750rpx;">
			<view v-for="(itmes,indexs) in jigou_daishang_er" :key="indexs" >
				<view style="font-size: 30.58rpx;color: #2E2E2E;font-weight: bold;display: flex;position: relative;left: -86rpx;z-index: 1212121;">
					<view>{{itmes[0].week}}</view>
					<view>
						<view style="width: 45rpx;height: 45rpx;border-radius: 50%;border: 12rpx solid #FF7300;box-sizing: border-box;margin: 0 15.7rpx;background: #FFFFFF;"></view>
					</view>
					<view>{{itmes[0].nian}}</view>
				</view>
				<view v-for="(itme,index) in itmes" :key="index" style="position: relative;display: flex;align-items: center;">
					<view style="position: absolute;left: -150.77rpx;color: #393939;font-size:25rpx;width: 200rpx;top:140rpx;z-index: 121212;">
						<text style="margin-left: 10rpx;">{{itme.duan}}</text>
					</view>
					<view style="display: flex;align-items: center;">
						<view style="display: flex;flex-direction: column;align-items: center;margin-right: 45.3rpx;">
							<view style="height: 140.3rpx;width: 2.41rpx;background: #FF7300;padding-top:10rpx ;"></view>
							<view style="width: 19.8rpx;height: 19.8rpx;background: #FF7300;border-radius: 50%;position: relative;"></view>
							<view style="height: 140.3rpx;width: 2.41rpx;background: #FF7300;padding-bottom: 10rpx;"></view>
						</view>
						<view style="width: 465.08rpx;background: #FFFFFF;border-radius: 18.12rpx;box-sizing: border-box;padding: 22.34rpx 27.77rpx 20rpx 29rpx;border: #D6D6D6 0.09rpx solid;position: relative;">
							<view style="padding: 0;margin: 0;display: flex;align-items: center;">
								<image :src="itme.avatar" style="width: 50.21rpx;height: 50rpx;border-radius: 50%;margin-right: 16rpx;vertical-align:top;" ></image>
								<text style="font-size: 25.744rpx;color: #BEBEBE;font-weight: bold;letter-spacing: 2rpx;padding: 0;margin: 0;">{{itme.nick_name}}</text>
								<view v-if="itme.week == '今日'" style="font-size: 25.744rpx;color: #FFFFFF;position: absolute;top: 65rpx;left: 400rpx;background: #EE7B30;padding: 5rpx 10rpx;border-radius: 20rpx;">今日课程</view>
							</view>
							<view style="font-size: 24.15rpx;font-weight: bold;color: #414141;margin: 15rpx 0;">{{itme.title_}}</view>
							<view style="position: absolute;min-width: 100rpx;height: 40rpx;line-height: 40rpx;text-align: center;padding: 0 10rpx;font-size: 25rpx;border: 1rpx solid #FF7300;border-radius: 25rpx;left: 250rpx;color: #FF7300;top: 80rpx;">{{itme.map.masterSetPriceEntity.label}}</view>
							<view class="kaike" style="margin: 15rpx 0;">开课教室: {{itme.classroom}}</view>
							<view style="display: flex;justify-content: space-between;width: 408.37rpx;">
								<view class="imp" @tap="qiandao_xuesheng(itme)" :style="{width:(content == '签到'? '170rpx' : '408.37rpx')}">{{content}}</view>
								<view class="imp"  v-if="content == '签到'" style="width: 170rpx;" @tap.stop="quxiaoyuyue(itme)">取消预约</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</scroll-view>
</template>
<script>
	export default {
		props:{
			list_shuju: Number
		},
		data(){
			return {
				triggered: false,
				active: 0,
				money: 10,
				num_li: 132121321,
				bgColor: "#ffffff",
				maskAlpha: 0.8,
				arr:[1,2,3,4],
				num:0,
				content:"签到",
				list_num:0,
				jigou_id:"",
				num_: 1,
				jigou_daishang:[],
				panduan_ji: "",
				user_id: "",
				xuesheng_number: 1,
				status: 2,
				jigou_daishang_:[],
				list_num_: 0,
				jigou_daishang_er: [],
				panduan_shuzi: 1,
				mechanism_id: "",
				master_id: "",
				appointment_id: "",
				master_set_price_id: "",
				study_card_id: "",
				panduan: 6,
				is_comment: false,
				student_id:"",
				currPage: 2, // 当前页码
				totalPage: 2 ,// 总页数
				biaoshi_xiala: 11,
				scrollTop: 0,
				yang_biao: 1,
				jigou_daishang_l: [],
				shu_zi: false,
				jigou_number: 1,
				panduan_num: 33,
				content_ji: "总结",
				isshow: true,
				dangqian: "",
				uploadName: {},
				titleColor: "#FF7300",
				xianshi: 1,
				start_time: ""
			}
		},
		methods:{
			gomaike(){
				uni.navigateTo({
					url:"/pages/Friend/videoChat/videoChat"
				})
			},
			lower(){
				if(this.panduan_shuzi == 1){
					this.xuesheng_number++
					this.xuesheng_shuju()
				}else{
					uni.showToast({
						title: "加载完毕",
						icon: "none"
					})
				}
			},
			onRefresh(){
				this.triggered = true
				this.jigou_daishang_ = []
				this.xuesheng_number = 1
				this.xuesheng_shuju()
			},
			quxiaoyuyue(itme){
						let me = this
						uni.showModal({
						    title: '取消预约',
						    content: '是否取消预约',
						    success: function (res) {
						        if (res.confirm) {
						            me.quxiao(itme)
						        } else if (res.cancel) {
						           
						        }
						    }
						});
					},
				async	quxiao(itme){
						let id = itme.id
						const res = await this.$myRequest({
							url: "/userAppointment/updateCancelCourse",
							data: {
								id: id
							},
							methed: "post",
							header: {
								'content-type': 'application/json'
							}
						})
						if(res.code == 0){
							uni.showToast({
								title: "取消成功"
							})
							setTimeout(() => {
								this.jigou_daishang_ = []
								this.jigou_daishang_er = []
								this.xuesheng_number = 1
								this.status = 2
								this.xuesheng_shuju()
							},100)
						}
					},
					add(){
						uni.navigateTo({
						    url: "/pages/Friend/applyFor/applyFor"
						})
					},
					gozongjie(index,itme){
						let cankao = {
							cankao: index
						}
						if(index == 'zongjie'){
							uni.navigateTo({
								url:"/pages/Friend/setRedPackets/setRedPackets?num=" + encodeURIComponent(JSON.stringify(itme))
							})
						}else{
							uni.navigateTo({
								url:"/pages/Friend/myLanguage/myLanguage?num=" + encodeURIComponent(JSON.stringify(itme))
							})
						}
					},
					zongjie_ji(itme){
						if(itme.you_){
							uni.navigateTo({
								url:"/pages/Friend/talkSet/talkSet?num=" + encodeURIComponent(JSON.stringify(itme))
							})
						}else{
							uni.showToast({
								title: '暂无学生预约',
								icon:"none"
							})
						}
					},
					
					godenglu(){
						uni.navigateTo({
							url:"/pages/tabBer/login/logins"
						})
					},
					qiandao_xuesheng(itme){
						this.mechanism_id = itme.mechanism_id
						this.master_id = itme.master_id
						this.appointment_id = itme.appointment_id
						this.master_set_price_id = itme.master_set_price_id
						this.study_card_id = itme.study_card_id
						this.student_id = itme.id
						if(this.content == "支付"){
							this.zhifuxiang(itme)
						}else if(this.content == "签到"){
							this.qiandao()
						}else if(this.content == "评价"){
							uni.navigateTo({
							    url: '/pages/Friend/tongxunlu/tongxunlu?num=' + encodeURIComponent(JSON.stringify(itme))
							})
						}else if(this.content == "查看评论"){
							uni.navigateTo({
							    url: '/pages/Friend/chat/chat?num=' + encodeURIComponent(JSON.stringify(itme))
							})
						}
					},
					// 签到
				async 	qiandao(){
							const res = await this.$myRequest({
								url:"/userAppointment/update",
								data:{
									status: "3",
									id: this.student_id
								},
								methed: "post",
								header:{
									'content-type':'application/json'
								}
							})
							if(res.code == 0){
								uni.showToast({
									title:"签到成功"
								})
							}
					   },
			async	xuesheng_shuju(){
					let me = this
					uni.showLoading({
					    title: '加载中'
					});
					me.shu_zi = false
					if(me.user_id != ""){
						const res = await me.$myRequest({
							url:"/userAppointment/queryOfflineSchedule",
							data:{
								offset: 8,
								user_id: me.user_id,
								type: "mechanism_offline",
								pageSize: 10,
								currentPage: me.xuesheng_number,
								status: me.status,
								is_comment: me.is_comment,
								start_time: me.start_time
							}
						})
						if(res.code == 0){
							if(res.data.length < 10){
								me.panduan_shuzi = 2
							}else{
								me.panduan_shuzi = 1
							}
							if(res.data.length == 0){
								me.shu_zi = true
							}
							let zhiqian = [],zhihou = []
							res.data.forEach((itme,index) => {
								itme.nian =itme.start_time.substring(0,10).replace(/\-/g,"/")
								let dd = me.week_fun(itme.start_time.replace(/\-/g,"/"))
								itme.duan = itme.start_time.substring(11,16) + "-" + itme.end_time.substring(11,16)
								if(itme.map.masterinfo != null && itme.map.masterAppointment != null){
									itme.nick_name = itme.map.masterinfo.nick_name
									itme.avatar = itme.map.masterinfo.avatar
									itme.classroom = itme.map.masterAppointment.classroom
									itme.title_ = itme.map.masterAppointment.title
								}else{
									itme.nick_name = "张三"
									itme.avatar = "http://img.curiousmore.com/B94-7F93F340F703/Documents/com_tencent_imsdk_data/image/huihe_982774855"
									itme.classroom = "教育中心"
									itme.title_ = "教付宝"
								}
								itme.week = dd
								if(index == (res.data.length - 1)){
									let d = {
										start_time:""
									}
									res.data.push(d)
								}
								if(res.data[index].start_time.substring(0,10).replace(/\-/g,"/") == res.data[index + 1].start_time.substring(0,10).replace(/\-/g,"/")){
									zhiqian.push(res.data[index])
								}else{
									zhiqian.push(res.data[index])
									zhihou.push(zhiqian.slice(0));
									zhiqian.length = 0;
								}
							})
							zhihou.forEach((itme) => {
								if(itme.length > 1){
									itme.reverse()
								}
							})
							if(me.jigou_daishang_.length == 0){
								me.jigou_daishang_ = zhihou
							}else{
								me.jigou_daishang_ = me.jigou_daishang_.concat(zhihou)
							}
							me.jigou_daishang_er = me.jigou_daishang_
							if(me.jigou_daishang_er.length == 0){
								me.xianshi = 2
							}
							uni.hideLoading()
							setTimeout(() => {
								me.triggered = false
							},1000)
						}else{
							uni.showToast({
								title:"未响应",
								icon:"none"
							})
						}
					}
					uni.hideLoading()
				},
			async	zhifuxiang(index){
					const res = await this.$myRequest({
						url: "/rechargerecord/queryPayDetails",
						data: {
							course_num: index.number_of_lessons,
							studycard_id: index.master_set_price_id,
							user_study_card_id: index.study_card_id,
							user_id: this.user_id,
							mechanism_id: this.mechanism_id
						}
					})
					if(res.code == 0){
						this.uploadName = res.data
						let data = Object.assign(res.data,index)
						uni.navigateTo({
						    url: "/pages/Friend/applyFor/applyFor?num=" + encodeURIComponent(JSON.stringify(data))
						})
					}
				},
				huanke(index,itme){
					let me = this
					if(itme == "已结束"){
						me.num_ = 2
						me.dangqian = ""
						me.isshow = false
					}else{
						me.num_ = 1
						me.isshow = true
						me.nian()
					}
					this.scrollTop = 30
					me.jigou_xuesheng()
					me.list_num = index
				},
				week_fun(index){
					let me = this
					let s = new Date(index).getTime()
					let dd = new Date(s).getDay()
					let d = ""
					if(dd == 1){
						d = "周一"
					}else if(dd == 2){
						d = "周二"
					}else if(dd == 3){
						d = "周三"
					}else if(dd == 4){
						d = "周四"
					}else if(dd == 5){
						d = "周五"
					}else if(dd == 6){
						d = "周六"
					}else if(dd == 0){
						d = "周日"
					}
					let d_ = new Date().getTime()
					if(index.substring(0,10).replace(/\-/g,"/") == me.nian()){
						d = "今日"
					}
					return d 
				},
				nian(){
					let dd = new Date().getTime()
					let s = new Date(dd)
					let nian = s.getFullYear()
					let yue = s.getMonth() + 1 < 10 ? "0" + (s.getMonth() + 1) :  s.getMonth() + 1
					let ri = s.getDate() < 10 ? "0" + s.getDate() : s.getDate()
					let shi = s.getHours() < 10 ? "0" + s.getHours() : s.getHours()
					let fen = s.getMinutes() < 10 ? "0" + s.getMinutes() : s.getMinutes()
					this.start_time = nian + "-" + yue + "-" + ri  + " " + shi + ":" + fen + ":" + "00" 
					this.dangqian = nian + "-" + yue + "-" + ri + " " + "00:00:00"
					return nian + "-" + yue + "-" + ri
				},
				scrolltolower(){
					if(this.panduan_ji == 12){
						if(this.panduan_shuzi == 1){
							this.jigou_number++
							this.jigou_xuesheng()
						}
					}else if(this.panduan_ji == 24){
						if(this.panduan_shuzi == 1){
							this.xuesheng_number++
							this.xuesheng_shuju()
						}
					}
				}
		},
		onLoad() {
			let me = this
			try{
				if(uni.getStorageSync('userif_list')){
					me.jigou_id = uni.getStorageSync('userif_list').mechanism_id
					me.user_id = uni.getStorageSync('userif_list').user_id
				}
			}catch(e){console.log(e)}
			me.nian()
			if(this.list_shuju === 0){
				this.status = 2
				this.content = "签到"
				this.is_comment = false
				this.xuesheng_shuju()
			}else if(this.list_shuju == 4){
				me.start_time = ""
				this.status = 9
				this.content = "查看评论"
				this.is_comment = true
				this.xuesheng_shuju()
			}else if(this.list_shuju == 2){
				me.start_time = ""
				this.status = 9
				this.content = "评价"
				this.is_comment = false
				this.xuesheng_shuju()
			}else if(this.list_shuju == 1){
				me.start_time = ""
				this.status = 8
				this.content = "支付"
				this.is_comment = false
				this.xuesheng_shuju()
			}else{
				this.xianshi = 2
			}
		}
		
	}
</script>
<style lang="scss" scoped>
	.imp{
		height: 47.112rpx;
		width: 408.37rpx;
		line-height:47.112rpx ;
		text-align: center;
		border-radius: 12.1rpx;
		border: 0.9rpx solid #FF7300;
		font-size: 27.744rpx;
		color: #FFFFFF;
		background: #FF7300;
	}
	.clo{
		color: #C4C4C4;
		border: 0.9rpx solid #C4C4C4;
	}
	.kaike{
		color: #FF7300;
		font-size: 24.744rpx;
		font-weight: bold;
	}
	.ranse{
		color: #FF7300;
	}
	.wu_id{
		height: 126rpx;
	}
	.you_id{
		height: 100rpx;
	}
	.list{
		width: 170rpx;
		height: 47.112rpx;
		background: #FF7300;
		color: #FFFFFF;
		border-radius: 12.1rpx;
		line-height: 47.112rpx;
		text-align: center;
	}
	.znong{
		height: 47.112rpx;
		width: 408.37rpx;
		line-height:47.112rpx ;
		text-align: center;
		border-radius: 12.1rpx;
		font-size: 27.744rpx;
		color: #FFFFFF;
	}
	.list_tan{
		width: 670rpx;
		display: flex;
		justify-content: space-between;
	}
</style>
